import { Row, Col, List, Avatar, Input } from 'antd';
import { history } from 'umi';
import { CommentOutlined } from '@ant-design/icons';
import styles from './style.less';

export default function Comment() {
  const data = [
    {
      title: 'Ant Design Title 1',
    },
    {
      title: 'Ant Design Title 2',
    },
    {
      title: 'Ant Design Title 3',
    },
    {
      title: 'Ant Design Title 4',
    },
  ];

  return (
    <div className={styles.box}>
      <div className={styles.comment}>
        {/*<Row>*/}
        {/*  <Col span={1}><CommentOutlined /></Col>*/}
        {/*  <Col span={23}>*/}
        {/*    <p className={styles.title}>千与千寻</p>*/}
        {/*    <p>wwwwwwwwwww</p>*/}
        {/*  </Col>*/}
        {/*</Row>*/}

        <List
          itemLayout="horizontal"
          dataSource={data}
          renderItem={(item) => (
            <List.Item>
              <List.Item.Meta
                avatar={<Avatar src="https://joeschmoe.io/api/v1/random" />}
                title={item.title}
                description="Ant Design, a design language for background applications, is refined by Ant UED Team"
              />
            </List.Item>
          )}
        />
      </div>
    </div>
  );
}
